.app-exercising{
    height: 20rem;
    background-color: #59b2db;
    color: #fff;
    font-size: .375rem;
    .container{
        margin: 0 .4844rem;
        height: 100%;
        .top{
            display: flex;
            flex: 1;
            justify-content: space-between;
            align-items: center;
            .left{
                display: flex;
                flex-direction: column;
                .run{
                    color: #AAD9F7;
                    font-size: .2656rem;
                }
            }
            .right{
                i{
                    font-size: .3906rem;
                }
            }
        }
        .kms{
            flex: 3;
            display: flex;
            justify-content: center;
            align-items: center;
            .number{
                font-size: 1.25rem;
            }
            .text{
                height: 1.20rem;
                display: flex;
                align-items: flex-end;
            }
        }
        .hint{
            flex: 1;
            display: flex;
            justify-content: space-between;
            align-items: center;
            hr{
                border-style: dotted;
                width: 2.5406rem;
            }
            a{
                font-size: .4688rem;
                color: #fff;
            }
        }
        .data{
            flex: 3;
            display: flex;
            justify-content: space-evenly;
            .left,
            .center,
            .right{
                flex: 1;
                display: flex;
                flex-direction: column;
                align-items: center;
                .top{
                    flex: 1;
                    display: flex;
                    flex-direction: column;
                    justify-content: space-evenly;
                    i{
                        font-size: .7969rem;
                    }
                    div{
                        color: #AAD9F7;
                    }
                }
                .bottom{
                    flex: 1;
                    font-size: 1rem;
                }
            }
            .center{
                flex: 1;
            }
            .right{
                flex: 1;
            }
        }
        .pause{
            flex: 2;
            display: flex;
            align-items: center;
            justify-content: end;
            .button{
                width: 2.5rem;
                height: 2.5rem;
                display: flex;
                background-color: #fff;
                flex-direction: column;
                align-items: center;
                justify-content: center;
                border-radius: 50%;
                font-size: .4469rem;
                i{
                    z-index: 1;
                    color: #59b2db;
                    font-size: .8469rem;
                }
                .text{
                    z-index: 1;
                    color: #59b2db;
                }
            }
            .lock{
                border: 1px solid #fff;
                justify-self: flex-end;
                margin-left: 2.3125rem;
                width: 1.0938rem;
                height: 1.0938rem;
                border-radius: 50%;
                display: flex;
                justify-content: center;
                align-items: center;
                i{
                    font-size: .4531rem;
                }
            }
        }
    }

}